<template>
	<view class="container">
		<!-- <fu-navbar title="扫码" bgColor="#0f68f0" color="#fff" isBackText></fu-navbar> -->
	</view>
</template>

<script>
var barcode = null;
export default {
	data() {
		return {
			name: '将二维码/条码放入框内，即可自动扫描', //要在扫码界面自定义的内容
			tip: '我的二维码',
			flash: false, //是否打开摄像头
			_vTab_now: null,
			_img_up_lst: null,
			_txt_lst: null,
			_img_dn_lst: null,
			_view_obj: null,
			screenWidth: global.screenWidth,
			screenHeight: global.screenHeight,
			isClick: false,
			type: '',
			tabType: ''
		}
	},
	onLoad(option) {
		this.type = option.type
		this.initView()
	},
	onBackPress() {
		// #ifdef APP-PLUS
		// 返回时退出全屏
		barcode.close();
		plus.navigator.setFullscreen(false);
		// #endif
	},
	onUnload() {
	    plus.navigator.setFullscreen(false);
	},
	methods: {
		initView() {
		  // #ifdef APP-PLUS
		  plus.navigator.setFullscreen(true); //全屏
		  let currentWebview = this.$scope.$getAppWebview();
		  this.createBarcode(currentWebview); //创建二维码窗口
		  // this.createView(currentWebview); //创建操作按钮及tips界面
		  this.createImgView(currentWebview);
		  this.createBottomView(currentWebview);
		  // this.createTabView(currentWebview)
		  // #endif
		},
		 // 扫码成功回调
		onmarked(type, result) {
		  var text = '未知: ';
		  switch (type) {
			case plus.barcode.QR:
			  text = 'QR: ';
			  break;
			case plus.barcode.EAN13:
			  text = 'EAN13: ';
			  break;
			case plus.barcode.EAN8:
			  text = 'EAN8: ';
			  break;
		  }
		  console.log('result', text, result);
		  plus.navigator.setFullscreen(false);
		  barcode.close();
		  if (this.type == this.tabType || !this.tabType) {
			  if (result.startsWith('EAM_EM')) {
				  let id = result.split('_')[2]
				  // uni.$emit('scanTap', id)
				  uni.redirectTo({
				  	url: `/pages/equipment/ledger/index?id=${id}`
				  })
			  } else if (result.startsWith('EAM_STOCK')) {
				  let id = result.split('_')[2]
				  let stockId = result.split('_')[3]
				  uni.$emit('scanTap', id, stockId)
				  uni.navigateBack();
			  }
		  } else if (this.tabType == 'rep') {
			  if (result.startsWith('EAM_EM')) {
				  let id = result.split('_')[2]
				  uni.$off('scanTap')
				  uni.redirectTo({
				  	url: `/pages/equipment/ledger/index?id=${id}`
				  })
			  } else {
				  uni.showToast({
				  	title: '二维码错误',
					icon: 'none'
				  })
				  setTimeout(() => {
					  uni.navigateBack();
				  }, 500)
			  }
		  } else if (this.tabType == 'part') {
			  if (result.startsWith('EAM_STOCK')) {
				  let id = result.split('_')[2]
				  let stockId = result.split('_')[3]
				  uni.$off('scanTap')
				  uni.redirectTo({
				  	url: `/pages/spare-parts/inStorage/index?fromPage=scanCode&id=${id}&stockId=${stockId}`
				  })
			  } else {
				  uni.showToast({
				  	title: '二维码错误',
					icon: 'none'
				  })
				  setTimeout(() => {
					  uni.navigateBack();
				  }, 500)
			  }
		  } else {
			  uni.showToast({
			  	title: '请选择出库单',
				icon: 'none'
			  })
			  setTimeout(() => {
				  uni.navigateBack();
			  }, 500)
		  }
		},
		// 创建二维码窗口
		createBarcode(currentWebview) {
			barcode = plus.barcode.create('barcode', [plus.barcode.QR, plus.barcode.EAN13, plus.barcode.EAN8, plus.barcode.CODE128], {
				top: '0',
				left: '0',
				width: '100%',
				height: '100%',
				scanbarColor: '#46B81E',
				position: 'absolute',
				frameColor: '#46B81E',
				background: '#46B81E'
			});
			barcode.onmarked = this.onmarked;
			barcode.setFlash(this.flash);
			currentWebview.append(barcode);
			barcode.start();
		},
		// 创建选择相册
		createImgView(currentWebview) {
			const icon = new plus.nativeObj.View('icon', {
				bottom: '100px',
				left: `${global.screenWidth - 72}px`,
				display: 'flex',
				width: '60px',
				height: '100px',
				flexDirection: 'column',
				alignItems: 'center'
			},[
			{
				tag: 'img',
				id: 'scanIcon',
				src: 'static/images/icon38.png',
				position: {
					width: '60px',
					height: '60px',
					// right: '12px',
					bottom: '26px'
				}
			},
			{
				tag: 'font',
				id: 'scanImgFont',
				text: '相册',
				textStyles: {
					size: '14px',
					color: '#fff'
				},
				position: {
					// right: '12px',
					bottom: '0px',
					width: '60px',
					height: '20px'
				}
			}])
			icon.interceptTouchEvent(true);
			currentWebview.append(icon);
			icon.addEventListener('click', (e) => {
				uni.chooseImage({
					count: 1,
					sourceType: ['album'],
					success(res) {
						console.log(res, 11)
						uni.getImageInfo({
							src:res.tempFilePaths[0],
							success:function(image){
								plus.barcode.scan(image.path, function(type, result) {
									console.log("扫描成功:(" + type + ")" + result);
									if (result.startsWith('EAM_EM')) {
										let id = result.split('_')[2]
										uni.$emit('scanTap', id)
										uni.navigateBack();
									} else if (result.startsWith('EAM_STOCK')) {
										let id = result.split('_')[2]
										let stockId = result.split('_')[3]
										uni.$emit('scanTap', id)
										uni.navigateBack();
									}
								}, function(e) {
									uni.showToast({
										title: '扫描失败，请重新选择图片',
										icon: 'none'
									})
									uni.navigateBack();
									console.log("Scan failed: " + JSON.stringify(e));
								});
							}
						})
					}
				})
			})
		},
		// 创建底部tab
		createBottomView(currentWebview) {
			const tabView0 = this.crtTab('rgba(255, 255, 255, 0.4)', 'rgba(255, 255, 255, 0.4)', 'rgba(255, 255, 255, 0.4)')
			const tabView1 = this.crtTab('#fff', 'rgba(255, 255, 255, 0.4)', 'rgba(255, 255, 255, 0.4)')
			const tabView2 = this.crtTab('rgba(255, 255, 255, 0.4)', '#fff', 'rgba(255, 255, 255, 0.4)')
			const tabView3 = this.crtTab('rgba(255, 255, 255, 0.4)', 'rgba(255, 255, 255, 0.4)', '#fff')
			const tab = new plus.nativeObj.View('tab', {
				bottom: '0px',
				left: '0px',
				height: '60px',
				width: '100vw',
				backgroundColor: '#000000',
				display: 'flex',
				alignItems: 'center',
				justifyContent: 'center'
			}, tabView0);
			tab.interceptTouchEvent(true);
			currentWebview.append(tab);
			if (this.type == 'rep') {
				tab.draw(tabView3)
			} else if (this.type == 'part') {
				tab.draw(tabView1)
			} else if (this.type == 'out') {
				tab.draw(tabView2)
			}
			tab.addEventListener('click', (e) => {
				let _Tab = this.switchTab(e.clientX);
				if(_Tab == this._vTab_now){return;}
				if (_Tab == 0) {
					this.tabType = 'part'
					tab.draw(tabView1)
				} else if (_Tab == 1) {
					this.tabType = 'out'
					tab.draw(tabView2)
				} else if (_Tab == 2) {
					this.tabType = 'rep'
					tab.draw(tabView3)
				}
			})
		},
		crtTab(col1, col2, col3) {
			return [{
				tag: 'font',
				id: 'scanTab1',
				text: '设备扫码',
				textStyles: {
					size: '14px',
					color: col1
				},
				position: {
					top: '0px',
					bottom: '0px',
					left: '20%',
					width: '20%',
					margin: 'auto 0'
				}
			},{
				tag: 'font',
				id: 'scanTab2',
				text: '出库扫码',
				textStyles: {
					size: '14px',
					color: col2
				},
				position: {
					top: '0px',
					bottom: '0px',
					left: '40%',
					width: '20%',
					margin: 'auto 0'
				}
			}, {
				tag: 'font',
				id: 'scanTab3',
				text: '扫码报修',
				textStyles: {
					size: '14px',
					color: col3
				},
				position: {
					top: '0px',
					bottom: '0px',
					left: '60%',
					width: '20%',
					margin: 'auto 0'
				}
			}]
		},
		switchTab(x) {
			let _w = this.screenWidth / 3 ;
			let _t = Math.ceil( x / _w)-1;
			// _w = null;
			return _t;
		}
		// 创建操作按钮及tips
		// createView(currentWebview) {
		// 	// 创建打开手电筒的按钮
		// 	var scanBarVew = new plus.nativeObj.View('scanBarVew', {
		// 		top: '55%',
		// 		left: '40%',
		// 		height: '10%',
		// 		width: '20%'
		// 	},
		// 		[{
		// 			tag: 'img',
		// 			id: 'scanBar',
		// 			src: 'static/icon1.png',
		// 			position: {
		// 				width: '28%',
		// 				left: '36%',
		// 				height: '30%'
		// 			}
		// 		},
		// 		{
		// 			tag: 'font',
		// 			id: 'font',
		// 			text: '轻触照亮',
		// 			textStyles: {
		// 				size: '10px',
		// 				color: '#ffffff'
		// 			},
		// 			position: {
		// 				width: '80%',
		// 				left: '10%'
		// 			}
		// 		}]
		// 	);
		// 	// var content2 = new plus.nativeObj.View('content2', {
		// 	// 	bottom: '0px',
		// 	// 	left: '0px',
		// 	// 	height: '10%',
		// 	// 	width: '100%',
		// 	// },)
		// 	scanBarVew.interceptTouchEvent(true);
		// 	currentWebview.append(scanBarVew);
		// 	scanBarVew.addEventListener("click", function (e) { //点亮手电筒
		// 		temp.flash = !temp.flash;
		// 		if (temp.flash) {
		// 		  scanBarVew.draw([{
		// 			tag: 'img',
		// 			id: 'scanBar',
		// 			src: 'static/flashlightOpen.png',
		// 			position: {
		// 			  width: '28%',
		// 			  left: '36%',
		// 			  height: '30%'
		// 			}
		// 		  },
		// 		  {
		// 			tag: 'font',
		// 			id: 'font',
		// 			text: '轻触关闭',
		// 			textStyles: {
		// 			  size: '10px',
		// 			  color: '#ffffff'
		// 			},
		// 			position: {
		// 			  width: '80%',
		// 			  left: '10%'
		// 			}
		// 		  }
		// 		  ]);
		// 		} else {
		// 		  scanBarVew.draw([{
		// 			tag: 'img',
		// 			id: 'scanBar',
		// 			src: 'static/flashlightClose.png',
		// 			position: {
		// 			  width: '28%',
		// 			  left: '36%',
		// 			  height: '30%'
		// 			}
		// 		  },
		// 		  {
		// 			tag: 'font',
		// 			id: 'font',
		// 			text: '轻触照亮',
		// 			textStyles: {
		// 			  size: '10px',
		// 			  color: '#ffffff'
		// 			},
		// 			position: {
		// 			  width: '80%',
		// 			  left: '10%'
		// 			}
		// 		  }
		// 		  ])
		// 		}
		// 		if (barcode) {
		// 		  barcode.setFlash(temp.flash);
		// 		}
		// 	  }, false)
		// }
	}
}
</script>

<style lang="scss" scoped>
.container {
	height: calc(100vh);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: relative;
}
</style>